<template>
  <div class="app-container">
    <el-row>
      <el-col :span="6" class="tab-title">
				相似性分析参数值设置
			</el-col>
    </el-row>
    <el-form ref="paramsRef" :model="form" label-width="100px">
	    <el-row>
	    	<el-col :span="6">
		    	<el-form-item prop="O">
		    		检索<el-input v-model="form.O" class="settings-input" />公里范围内设定地震
		    	</el-form-item>    		
	    	</el-col>
	    </el-row>
	    <el-row>
	    	<el-col :span="6">
	    		<el-form-item prop="U">
		    		检索<el-input v-model="form.U" class="settings-input" />公里范围内历史地震灾害
		    	</el-form-item>
	    	</el-col>
	    </el-row>
	    <el-row style="font-weight: bold;">权重值设置：</el-row>
	    <el-row>
	    	<el-col :span="6">
	    		<el-form-item prop="W1">
		    		震中距离的指标<el-input v-model="form.W1" class="settings-input" />%
		    	</el-form-item>
	    	</el-col>
	    </el-row>
	    <el-row>
	    	<el-col :span="12">
	    		<el-form-item prop="W2">
		    		房屋抗震能力指标  <el-input v-model="form.W2" class="settings-input" /> % ，
		    	</el-form-item>
		    	<el-form-item prop="D1">
		    		其中房屋总栋数指标
		    		<el-input v-model="form.D1" class="settings-input" /> % ，
		    	</el-form-item>
		    	<el-form-item prop="D2">
		    		疑似抗震能力严重不足房屋总栋数指标
		    		<el-input v-model="form.D2" class="settings-input" /> % ，
		    	</el-form-item>
		    	<el-form-item prop="W3">
		    		震级指标<el-input v-model="form.W3" class="settings-input" /> % 
		    	</el-form-item>
	    	</el-col>
	    </el-row>
	  </el-form>
	  <el-row>
	  	<el-col :span="12" :offset="2">
	  		<el-button type="primary" @click="saveForm">保 存</el-button>
	  	</el-col>
	  </el-row>
  </div>
</template>

<script setup name="parameterSettings">
import { getParamSetting, addParamSetting } from '@/api/assistPolicy/parameterSettings'
const { proxy } = getCurrentInstance();
const data = reactive({
	form:{
		O:'',
		U:'',
		W1:'',
		W2:'',
		D1:'',
		D2:'',
		W3:''
	},
  list: [],
  currentPage: 1,
  pageSize: 10,
  total: 0
})
const {form } = toRefs(data)

onMounted(() => {
	getList()
})

const getList = () => {
	getParamSetting().then(res => {
		if(res.data){
			form.value = res.data
		}
	})
}

// 校验表单
function checkW() {
	var chackProportion = 0;
	chackProportion = parseFloat(form.value.W1) + parseFloat(form.value.W2) + parseFloat(form.value.W3)
  if(chackProportion == 100){
  	return true 
  }else{
  	return false
  }   
}
function checkD() {
	var chackProportion = 0;
	chackProportion = parseFloat(form.value.D1) + parseFloat(form.value.D2)
   
  if(chackProportion == 100){
  	return true 
  }else{
  	return false
  }   
}
function saveForm(){
	if(checkW() && checkD()){
		addParamSetting(form.value).then(response => {
      proxy.$modal.msgSuccess("保存成功");
      getList();
    });
	}else if(checkW() == true && checkD() == false){
		proxy.$modal.msgError("房屋总栋数指标权重（D1）+疑似抗震能力严重不足房屋总栋数指标（D2）=100%");
	}else if(checkW() == false && checkD() == true){
		proxy.$modal.msgError("震中距离的指标权重（W1）+房屋抗震能力指标权重（W2）+震级指标权重（W3）=100%");
	}else{
		proxy.$modal.msgError("震中距离的指标权重（W1）+房屋抗震能力指标权重（W2）+震级指标权重（W3）=100%，房屋总栋数指标权重（D1）+疑似抗震能力严重不足房屋总栋数指标（D2）=100%");
	}
}
</script>

<style scoped lang="scss">
.tab-title {
	font-size: 16px;
	font-weight: bold;
	border-left: 4px solid var(--el-color-primary);
	font-family: PingFangSC-Medium;
	padding-left: 10px;
	margin-bottom: 20px;
}
.settings-input{
	width: 100px;
	margin: 0 10px;
}
</style>
